<style>
  #bookMessage-update {
    padding: 20px 25px 25px 0;
  }

  #bookMessage-update .layui-treeSelect .ztree li a, .ztree li span {
    margin: 0 0 2px 3px !important;
  }
</style>
<div class="layui-fluid" id="bookMessage-ask">
  <form class="layui-form" action="" lay-filter="bookMessage-ask-form">
    <div class="layui-form-item">
      <label class="layui-form-label febs-form-item-require">图书名称：</label>
      <div class="layui-input-block">
        <input type="text" name="bookname" minlength="1" maxlength="10" lay-verify="required"
               autocomplete="off" class="layui-input" readonly>
      </div>
    </div>
    <div class="layui-form-item">
      <label class="layui-form-label febs-form-item-require">价格：</label>
      <div class="layui-input-block">
        <input type="text" name="bookmoney" autocomplete="off" class="layui-input"
               lay-verify="required|number" readonly>
      </div>
    </div>
    <div class="layui-form-item">
      <label class="layui-form-label febs-form-item-require">图书类型：</label>
      <div class="layui-input-block">
        <input type="text" name="type" autocomplete="off" class="layui-input"
               lay-verify="required" readonly>
      </div>
    </div>
    <div class="layui-form-item">
      <label class="layui-form-label febs-form-item-require">采购数量：</label>
      <div class="layui-input-block">
        <input type="text" name="num" id="num" autocomplete="off" class="layui-input"
               lay-verify="required|number" placeholder="请输入要采购的数量">
      </div>
    </div>
    <div style="display: flex;justify-content: flex-end;font-weight: bolder;font-size: 20px">批用金额：
      <input id="totalmoney" style="border:none;width: 50px;line-height:20px" value="0" readonly>元
    </div>
    <div class="layui-form-item febs-hide">
      <button class="layui-btn" lay-submit="" lay-filter="bookMessage-ask-form-submit" id="submit"></button>
    </div>
  </form>
</div>

<script data-th-inline="javascript">
  layui.use(['febs', 'form', 'validate'], function () {
    var $ = layui.$,
        febs = layui.febs,
        layer = layui.layer,
        form = layui.form,
        bookMessage = [[${bookMessage}]],
        $view = $('#bookMessage-ask'),
        validate = layui.validate;

    form.verify(validate);
    form.render();
    initbookMessageValue();

    $(function () {
      var number = '';
      $('#num').on('input', function (msg) {
        number = msg.delegateTarget.value;
        $('#totalmoney').val(bookMessage.bookmoney * number);
      });
    });

    function initbookMessageValue() {
      form.val("bookMessage-ask-form", {
        "bookname": bookMessage.bookname,
        "bookmoney": bookMessage.bookmoney,
        "type": bookMessage.type,
        "num": bookMessage.num
      });
    }

    form.on('submit(bookMessage-ask-form-submit)', function (data) {
      if (febs.nativeEqual(data.field, bookMessage)) {
        febs.alert.warn('您还未填写采购数量！');
        return false;
      }
      febs.post(ctx + 'bookMessage/askone/', data.field, function () {
        layer.closeAll();
        febs.alert.success('采购' + data.field.num + '本' + bookMessage.bookname + '，添加成功');
        $('#febs-bookMessage').find('#query').click();
      });
      return false;
    });
  });
</script>